<template>
  <div>
    <el-row :gutter="10">
      <el-col :span="24">
        <el-card shadow="never" class="card">
          <div id="charts_one" style="width:100%;min-height:80vh">
            <Search size='small' :searchVisible="searchVisible" :searchData.sync="searchData"  :searchForm="searchForm" @refresh_list="index"></Search>
            <div class="btn-group" style="margin-bottom:11px;">
              <div>
<!--                <el-button type="success" :disabled="multiple" size="mini" icon="el-icon-success"  @click="audit(billNoList)" >审核</el-button>-->
                <el-button type="warning"  size="mini" icon="el-icon-upload"  @click="importData()" >{{$t('action.importData')}}</el-button>
              </div>
              <table-tool :searchVisible.sync="searchVisible"  :fieldList="fieldList" @refresh_list="index" :searchTool="true"></table-tool>
            </div>
            <el-table :row-class-name="rowClass" @selection-change="selection"  @row-click="handleRowClick"  row-key="id"  :header-cell-style="{ background: '#eef1f6', color: '#606266' }" v-loading="loading"  ref="multipleTable" border class="eltable" :data="list"  style="width: 100%">
              <el-table-column align="center" type="selection" width="42"></el-table-column>
              <el-table-column align="center" type='' v-if="fieldList[0].checked" property="id" label="ID" show-overflow-tooltip width="70">
              </el-table-column>
              <el-table-column align="center"  property="status" label="单据状态" show-overflow-tooltip width="" >
                <template slot-scope="scope">
                  <el-tag type="success" v-if="scope.row.status === 'save'" size="mini" effect="dark">保存</el-tag>
                  <el-tag type="danger" v-if="scope.row.status === 'audit'" size="mini" effect="dark">审核</el-tag>
                </template>
              </el-table-column>
              <el-table-column align="center"  property="billNo" label="单据编号" show-overflow-tooltip width="120" >
              </el-table-column>
              <el-table-column align="center"  property="moBillNo" label="生产订单" show-overflow-tooltip width="120" >
              </el-table-column>
              <el-table-column align="center"  property="planNo" label="工序计划" show-overflow-tooltip width="" >
              </el-table-column>
              <el-table-column align="center>"  property="specification" label="件号" show-overflow-tooltip width="" >
              </el-table-column>
              <el-table-column align="center>"  v-if="fieldList[3].checked" property="createTime" label="创建时间" show-overflow-tooltip width="" >
              </el-table-column>
              <el-table-column align="center"  v-if="fieldList[4].checked" property="createUserName" label="创建人" show-overflow-tooltip width="" >
              </el-table-column>
              <el-table-column align="center"  v-if="fieldList[6].checked" property="workShopName" label="车间" show-overflow-tooltip width="" >
              </el-table-column>

              <el-table-column align="center"  property="quaQty" label="合格数量" show-overflow-tooltip width="" >
              </el-table-column>

              <el-table-column align="center"  property="failQty" label="报废数量" show-overflow-tooltip width="" >
              </el-table-column>

              <el-table-column align="center"  property="kingdeePickNo" label="领料" show-overflow-tooltip width="" >
              </el-table-column>

              <el-table-column align="center"  property="kingdeeReport" label="汇报" show-overflow-tooltip width="" >
              </el-table-column>

              <el-table-column align="center"  property="kingdeeInNo" label="入库" show-overflow-tooltip width="" >
              </el-table-column>

              <el-table-column align="center"  property="kingdeeFeedNo" label="补料" show-overflow-tooltip width="" >
              </el-table-column>
              <el-table-column align="center"  property="kingdeeReturn" label="退料" show-overflow-tooltip width="" >
              </el-table-column>
<!--              <el-table-column :fixed="$store.getters.device !== 'mobile'?'right':false" label="操作" align="center" width="160">-->
<!--                <template slot-scope="scope">-->
<!--                  <div v-if="scope.row.id">-->
<!--                    <el-button size="mini" type="text" @click="detail(scope.row)"  style="color:#0066FF" ><i class="el-icon-view" />{{$t('action.detail')}}</el-button>-->
<!--                  </div>-->
<!--                </template>-->
<!--              </el-table-column>-->

            </el-table>
            <Page :total="page_data.total" :page.sync="page_data.page" :limit.sync="page_data.limit" @pagination="index" />
          </div>
        </el-card>
      </el-col>
    </el-row>
    <!--导入-->
    <importData  :show.sync="dialog.importDataDialogStatus" size="small" @refresh_list="index"></importData>
    <!--查看详情-->
    <Detail :info="detailInfo" :show.sync="dialog.detailDialogStatus" size="small" @refresh_list="index"></Detail>
  </div>
</template>
<script>
import {
  packageList,
  del,
  auditReportPackage
} from '@/api/app/sfcoptrpt'
import Search from '@/components/common/Search.vue'
import Page from '@/components/common/Page.vue'
import TableTool from '@/components/common/TableTool.vue'
import { confirm,param2Obj } from '@/utils/common'
import Detail from '@/views/app/sfcoptrpt/packageDetail.vue'
import importData from '@/views/app/proplan/importReport.vue'
export default {
  name:'sfcOptrpt',
  components: {
    Search,
    Page,
    TableTool,
    importData,
    Detail,
  },
  data(){
    return {
      dialog: {
        addDialogStatus : false,
        updateDialogStatus : false,
        detailDialogStatus : false,
        importDataDialogStatus : false,
      },
      fieldList:[
        {lable:'ID',checked:false},
        {lable:this.$t('field.SfcOptrpt_ErpBillNo'),checked:true},
        {lable:this.$t('field.SfcOptrpt_BillNo'),checked:true},
        {lable:this.$t('field.SfcOptrpt_PrdBillNo'),checked:true},
        {lable:this.$t('field.SfcOptrpt_Date'),checked:true},
        {lable:this.$t('field.SfcOptrpt_PrtUser'),checked:true},
        {lable:this.$t('field.SfcOptrpt_WorkShopNo'),checked:false},
        {lable:this.$t('field.SfcOptrpt_WorkShopName'),checked:true},
      ],
      ids: [],
      statusList:[
        {
          val:'save',
          key:'保存'
        },
        {
          val:'audit',
          key:'审核'
        }

      ],
      selectRows:[],
      selectTotal:0,
      single:true,
      multiple:true,
      list: [],
      small_tables:{},
      detailInfo:{},
      importDataInfo:{},
      loading: false,
      page_data: {
        limit: 20,
        page: 1,
        total:20,
      },
      searchVisible:true,
      searchForm:[],
      searchData:{},
      billNoList:[]
    }
  },
  methods: {
    importData(){
      this.dialog.importDataDialogStatus = true
    },
    //审核汇报单
    audit(row){
      //校验单据是否都是保存状态，已经审核的不允许再次审核
      const status = this.selectRows.every(item =>{
        return item.status === 'save'
      })
      if (!status){
        this.$message.warning('选中的单据必须都是保存状态')
        return
      }
      //校验选中的单据，外协 + 返修 = 废料
      const invalidList = this.selectRows.filter(item => {
        const outFail = Number(item.outFailQty) || 0;
        const ret = Number(item.returnQty) || 0;
        const fail = Number(item.failQty) || 0;
        return Math.abs(outFail + ret - fail) > 1e-6; // 容错浮点
      });

      if (invalidList.length > 0) {
        const errNos = invalidList.map(i => i.billNo).join('，');
        this.$message.warning(`以下单据不符合规则：${errNos}，请确认外协不良 + 返修数量 = 报废数量`);
        return;
      }
      this.$confirm('是否审核',{
        confirmButtonText:'确定',
        cancelButtonText:'取消',
        type:'success'
      }).then(()=>{
        auditReportPackage({billNoList : this.billNoList}).then(res =>{
          this.$message({
            type: 'success',
            message: '审核成功!'
          });
          this.index()
        })
      })

    },
    index(){
      let param = {limit:this.page_data.limit,page:this.page_data.page}
      Object.assign(param, this.searchData,param2Obj(this.$route.fullPath))
      this.loading = true
      packageList(param).then(res => {
        this.list = res.data.data
        this.small_tables=res.sql_field_data
        this.page_data.total = res.data.total
        this.loading = false
        if(this.page_data.page == 1){
          this.searchForm = [
            {type:'Input',label:'单据编号',prop:'billNo',width:'150px'},
            {type:'Input',label:'生产订单',prop:'moBillNo',width:'150px'},
            {type:'datetime',label:'创建时间',prop:'createTime',width:'150px'},
            {type:'Select',label:'单据状态',prop:'status',width:'150px',data : this.statusList },
          ]
        }
      })
    },
    del(row){
      confirm({content:this.$t('system.confirmOperation')}).then(() => {
        let ids = row.id ? row.id : this.ids.join(',')
        del({id:ids}).then(res => {
          this.$message({message: this.$t(res.msg), type: 'success'})
          this.index()
        })
      }).catch(() => {})
    },
    detail(row){
      this.detailInfo = row
      this.dialog.detailDialogStatus = true
    },
    selection(selection) {
      this.selectRows=selection
      this.selectTotal=selection.length
      this.ids = selection.map(item => item.id)
      this.billNoList = selection.map(item => item.erpBillNo)
      this.single = selection.length != 1
      this.multiple = !selection.length
    },
    handleRowClick(row, rowIndex,event){
      if(event.target.className !== 'el-input__inner'){
        this.$refs.multipleTable.toggleRowSelection(row)
      }
    },
    rowClass ({ row, rowIndex }) {
      for(let i=0;i<this.ids.length;i++) {
        if (row.id === this.ids[i]) {
          return 'rowLight'
        }
      }
    },
  },
  mounted(){
    this.index()
  }
}
</script>
<style  lang="scss">
@import '@/assets/scss/common.scss';
</style>